<!DOCTYPE html>
<!--[if IE 9]><html class="lt-ie10" lang="en"><![endif]-->
<html class="no-js" lang="en">

<head>
    <meta charset="utf-8" />
    <title>{{pageTitle}}</title>
    <meta name="description" content="{{pageDescription}}" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" href="{{basePath}}/assets/img/favicon.png?autoresume" type="image/x-icon" />
    <script type='text/javascript' src='{{basePath}}/assets/js/vendor/modernizr.js'></script>
    <link href="{{basePath}}/assets/css/notices.css" type="text/css" rel="stylesheet" />
    <link href="{{basePath}}/assets/css/normalize.css" type="text/css" rel="stylesheet" />
    <link href="{{basePath}}/assets/css/foundation.css" type="text/css" rel="stylesheet" />
    <link href="{{basePath}}/assets/icons/foundation-icons.css" type="text/css" rel="stylesheet" />
    <link href="{{basePath}}/assets/css/animate.css" type="text/css" rel="stylesheet" />
    <link href="{{basePath}}/assets/css/pizza.css" type="text/css" rel="stylesheet" />
    <link href="{{basePath}}/assets/css/app.css" type="text/css" rel="stylesheet" />
    <link href="{{basePath}}/assets/css/print.css" rel="stylesheet" type="text/css" media="print" />
</head>

<body>
    <div id="header">
        <div class="row animated fadeInDown">
            <div class="large-2 columns">
                <h2>{{name}}</h2>
                <h6 class="light">{{pageDescription}}</h6>
            </div>
            {{{basicInfo}}}
            <div class="large-1 columns text-right website"><a href="{{basePath}}/AutoResume.zip"><i class="fi-arrow-down"></i> 下载</a></div>
        </div>
    </div>
    <div class="row main">
        <div class="large-6 columns">
            <div class="avoid_pagebreak animated fadeInUp">
                <h4 class="title"><i class="fi-torso"></i> 个人简介</h4>
                <div class="info">
                    {{personalInfo}}
                </div>
            </div>
            <div class="avoid_pagebreak animated fadeInUp">
                <h4 class="title"><i class="fi-like"></i> 技能专长</h4>
                <div class="row specialities">
                    {{{specialities}}}
                </div>
            </div>
            <div class="avoid_pagebreak animated fadeInUp">
                <h4 class="title"><i class="fi-star"></i> 技能评价</h4>
                <div class="row skill">
                    <div class="large-7 columns animated fadeIn">
                        <h6>编程技能</h6>
                        {{{skillsList}}}
                    </div>
                    <div class="large-5 columns animated fadeIn">
                        <h6>能力简述</h6>
                        {{{skillsDescription}}}
                    </div>
                </div>
            </div>
            <div class="avoid_pagebreak animated fadeInUp">
                <h4 class="title"><i class="fi-social-github"></i> 社区经验</h4>
                <div class="community">
                    <p>Github：
                        <a href="https://github.com/{{GitHubID}}"><img src="http://ghchart.rshah.org/{{GitHubID}}" alt="Github Chart of {{GitHubID}}" /></a></p>
                    <hr />
                    <table>
                        <thead>
                            <tr>
                                <th>领域</th>
                                <th>日常社区活动</th>
                            </tr>
                        </thead>
                        <tbody>
                            {{{community}}}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <div class="large-6 columns">
            <div class="avoid_pagebreak animated fadeInUp">
                <h4 class="title"><i class="fi-lightbulb"></i> 个人经验</h4>
                <div class="row experience">
                    {{{experience}}}
                </div>
            </div>
            <div class="avoid_pagebreak animated fadeInUp">
                <h4 class="title"><i class="fi-flag"></i> 项目经历（部分）</h4>
                <div class="pro_surround">
                    <div class="pro animated">
                        {{{project}}}
                    </div>
                </div>
            </div>
            <div class="avoid_pagebreak animated fadeInUp">
                <h4 class="title"><i class="fi-book"></i> 开源项目</h4>
                <div class="row recognitions">
                    {{{opensource}}}
                </div>
            </div>
            <div class="avoid_pagebreak animated fadeInUp">
                <h4 class="title"><i class="fi-link"></i> 扩展技能</h4>
                <div class="row interests">
                    {{{interests}}}
                </div>
            </div>
        </div>
    </div>
    <div class="row footer">
        <div class="large-12 small-12 medium-12 text-center ">
            <div class="border text-center "></div>
            <p class="copyright">2017 <a href="https://www.eyrefree.org/">FEYeh</a> &
                <a href="https://github.com/FEYeh/autoresume">AutoResume</a></p>
        </div>
    </div>
    <script src="{{basePath}}/assets/js/jquery-2.x.min.js" type="text/javascript"></script>
    <script src="{{basePath}}/assets/js/foundation.min.js" type="text/javascript"></script>
    <script src="{{basePath}}/assets/js/vendor/snap.svg.js" type="text/javascript"></script>
    <script src="{{basePath}}/assets/js/pizza.js" type="text/javascript"></script>
    <script type="text/javascript">
    Pizza.init(document.body, {
        donut: true,
        donut_inner_ratio: 0.7,
    });
    </script>
</body>

</html>